﻿<%@ Page Title="" Language="C#" MasterPageFile="~/EasyUI.Master" AutoEventWireup="true" CodeBehind="Listmy.aspx.cs" Inherits="jnlamp.Web.lampinfo.Listmy" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=6a5e0746feee514e8bb7b3f468a626d1"></script>
    <script src="../Script/TextIconOverlay_min.js"></script>
    <script src="../Script/MarkerClusterer_min.js"></script>
    <script src="../Script/jnbase.js"></script>
    <script src="../Script/datetime.js"></script>
    <script type="text/javascript">
        var pt;
        var ptmark;
        var uid = "";
        var map;
        var gid = "";
        var city = "";
        var icon1 = new BMap.Icon('../images/map1.gif', new BMap.Size(18, 34), { anchor: new BMap.Size(9, 34) });
        var icon2 = new BMap.Icon('../images/map2.gif', new BMap.Size(18, 34), { anchor: new BMap.Size(9, 34) });
        var ply;//区域线        
        var jd = "";
        var wd = "";
        var gjd = "";
        var gwd = "";
        var gwid = "";
        var markerClusterer;
        var markers = [];
        var data_info;
        var ISOneRow = 0;
        var sprovince = "";
        var scity = "";
        var scounty = "";
        var se = ""; //镇
        var sebm = "";//镇的编码        
        var loc = "";//选择点的地址        
        var label;
        $.extend($.fn.tree.methods, {
            getLevel: function (jq, target) {
                var l = $(target).parentsUntil("ul.tree", "ul");
                return l.length + 1;
            }
        });
        $(function () {
            InitMap();
            InitTree();
            InitGird();
            InitSearch();                     
        });
        function InitA() {
            var ptt;
            var marker;
            map.clearOverlays();
            ptt = new BMap.Point(gjd, gwd);
            marker = new BMap.Marker(ptt, { icon: icon1 });
            map.addOverlay(marker);
            label = new BMap.Label(gwid, { offset: new BMap.Size(20, -10) });
            marker.setLabel(label);
            map.centerAndZoom(ptt, 13);

        }
        function InitMap() {
            map = new BMap.Map("mymap");          // 创建地图实例 
            map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
            
            var top_left_control = new BMap.ScaleControl({ anchor: BMAP_ANCHOR_TOP_LEFT });// 左上角，添加比例尺
            var top_left_navigation = new BMap.NavigationControl();  //左上角，添加默认缩放平移控件
            map.addControl(top_left_control);
            map.addControl(top_left_navigation);
            map.enableScrollWheelZoom(true);
            map.centerAndZoom("济南", 11);
           
        }
        //初始化表格
        function InitTree() {
            $('#pt').tree({
                width: '100%', //宽度                
                lines: true,
                //data: provincetree,   
                url: '../areainfo/GetArea.ashx', //请求数据的页面 
                method: 'post',
                queryParams: { "action": "querymyareauser" },
                onBeforeExpand: function (node) {
                    $("#pt").tree("options").queryParams = { "action": "queryyb" };
                    $('#pt').tree('options').url = "../areainfo/GetArea.ashx?pid=" + node.id;
                },
                onClick: function (node) {
                    sprovince = scity = scounty = se = "";
                    if (node.text != "") {
                        var lv = $('#pt').tree("getLevel", node.target);
                        if (lv == 2) {
                            sprovince = node.text;
                        }
                        else if (lv == 3) {
                            scity = node.text;
                            sprovince = $('#pt').tree("getParent", node.target).text;
                        }
                        else if (lv == 4) {
                            scounty = node.text;
                            var node1 = $('#pt').tree("getParent", node.target)
                            scity = node1.text;
                            sprovince = $('#pt').tree("getParent", node1.target).text;
                        }
                        else if (lv == 5) {

                            var node1 = $('#pt').tree("getParent", node.target);
                            scounty = node1.text;
                            var node2 = $('#pt').tree("getParent", node1.target);
                            scity = node2.text;
                            sprovince = $('#pt').tree("getParent", node2.target).text;
                            se = node.text;

                        }
                        sebm = node.bm;
                        map.clearOverlays();
                        getBoundary(sprovince + scity + scounty);
                        $('#myinfo').html("");
                        reloadgrid();
                    }
                },
                onLoadSuccess: function (node, param) {
                    //reloadgrid();
                }
            });

        }

        function InitGird() {
            $('#tt').datagrid({
                title: '基地列表', //表格标题
                url: '../baseinfo/GetBase.ashx', //请求数据的页面
                sortName: 'basedate', //排序字段
                idField: 'bid', //标识字段,主键
                iconCls: '', //标题左边的图标
                width: '100%', //宽度
                //height: $(parent.document).find("#mainPanle").height() - 35 > 0 ? $(parent.document).find("#mainPanle").height() - 35 : 500, //高度
                nowrap: true, //是否换行，True 就会把数据显示在一行里
                striped: true, //True 奇偶行使用不同背景色
                collapsible: false, //可折叠
                singleSelect: true,
                sortOrder: 'desc', //排序类型
                remoteSort: true, //定义是否从服务器给数据排序
                fitColumns: false,
                method: 'post',
                columns: [[                    
                    { title: '基地名称', field: 'basename', width: 100 },
                    {
                        title: '创建日期', field: 'basedate',sortable: true, width: 90, formatter: function (value, row, index) {
                            if (value != "") {

                                if (value.indexOf("-") != -1)
                                    value = value.replace(/-/g, "/");
                                return new Date(value).pattern("yyyy年M月d日");
                            }
                        }
                    },
                    {
                        title: '灯浏览', field: 'a', width: 60, formatter: function (value, row, index) {                            
                            return '<a href="#" onclick="ISOneRow = 0;top.addTab(\'' + row.basename + '\',\'/lampinfo/showbase.aspx?bid=' + row.bid + '\', \'icon icon-magic\');">灯浏览</a>';

                        }
                    },
                    { title: '项目', field: 'proname', width: 80 },
                    { title: '地址', field: 'address', width: 150 },
                    
                    { title: '备注', field: 'basemark', width: 150 }
                ]],
                onClickRow: function (rowIndex, rowData) {
                    if (ISOneRow == 1) {
                        if (rowData.bid != "")
                        {
                            showlamp(rowData.bid);
                        showmap(rowData.bid);
                        
                        }
                    }
                    else {
                        ISOneRow = 1;
                    }
                    
                },
                onLoadSuccess: function (data) {
                    //根据所有基地加载网关与灯
                    var baseids = "";
                    $.each(data.rows, function (k, v) {
                        if (baseids.length > 0)
                            baseids = baseids + "," + v["bid"];
                        else
                        {
                            baseids = v["bid"];
                        }                        
                    });
                    if (baseids != "")
                        {
                    //showmap(baseids);
                    showlamp(baseids);
                }
                    
                },
                toolbar: "#tab_toolbar",
                queryParams: { "action": "querymy","sebm":sebm },
                pagination: true, //是否开启分页
                pageList: [10, 20, 30, 40, 50],
                pageNumber: 1, //默认索引页
                pageSize: 20, //默认一页数据条数
                rownumbers: true //行号
            });
            $('#tt').datagrid('getPager').pagination({
                layout: ['list', 'prev', 'next', 'refresh']
            });
        }
        function showlamp(baseids) {
            $.ajax({
                type: "post",
                dataType: "json",
                url: "/lampinfo/GetScd.ashx?action=querybc&bid=" + baseids,
                success: function aa(data) {
                    var info = "";
                    info = "共有灯" + data.total + "台。";
                    //var sl = [];
                    //var sh = [];
                    //var state = "";
                    //var mname = "";
                    //var slnum = 0;
                    //var shnum = 0;
                    //$.each(data.rows, function (k, v) {
                    //    state = v["lampstatus"];
                    //    if (state == '3' || state=='') {
                    //        slnum = slnum + 1;
                    //        mname = v["mname"];
                    //        if (sl[mname]) {
                    //            sl[mname] = sl[mname] + 1;
                    //        }
                    //        else {
                    //            sl[mname] = 1;
                    //        }
                    //    }
                    //    else if (state == '2') {
                    //        shnum = shnum + 1;
                    //        mname = v["mname"];
                    //        if (sh[mname]) {
                    //            sh[mname] = sh[mname] + 1;
                    //        }
                    //        else {
                    //            sh[mname] = 1;
                    //        }
                    //    }

                    //});
                    //var outputsl = "";
                    //for (var key in sl) {
                    //    if (sl.hasOwnProperty(key))
                    //        if (outputsl == "") {
                    //            outputsl = key + '(' + sl[key] + ')';
                    //        }
                    //        else {
                    //            outputsl += "、" + key + '(' + sl[key] + ')';
                    //        }
                    //}
                    //var outputsh = "";
                    //for (var key in sh) {
                    //    if (sh.hasOwnProperty(key))
                    //        if (outputsh == "") {
                    //            outputsh = key + '(' + sh[key] + ')';
                    //        }
                    //        else {
                    //            outputsh += "、" + key + '(' + sh[key] + ')';
                    //        }
                    //}
                    //if (slnum > 0)
                    //    info = info + "失联" + slnum + "台，失联详情：" + outputsl + "。";
                    //if (shnum > 0)
                    //    info = info + "损坏" + shnum + "台,损坏详情：" + outputsh + "。";
                    $('#myinfo').html(info);
                }
            });
        }
        function showmap(baseids)
        {
            $.ajax({
                type: "post",
                dataType: "json",
                url: "/lampinfo/GetLamp.ashx?action=querygl&baseids=" + baseids,
                success: function aa(data) {
                    map.clearOverlays();
                    data_info = [];
                    $.each(data.rows, function (k, v) {
                        data_info.push({ "lng": v["gjd"], "lat": v["gwd"], "gwid": v["gwid"], "lampid": v["lampid"], "gltype": v["gltype"], "basename": v["basename"] });
                    });
                    var marker;
                    var ptt = "";
                    if (markers.length > 0) {
                        if (markerClusterer != null) {
                            markerClusterer.removeMarkers(markers);
                            markerClusterer = null;
                        }
                        markers = [];
                    }
                    for (var i = 0; i < data_info.length; i++) {
                        ptt = new BMap.Point(data_info[i].lng, data_info[i].lat);
                        if (data_info[i].gltype == "gateway") {
                            marker = new BMap.Marker(ptt, { icon: icon1 });
                            map.addOverlay(marker);
                            label = new BMap.Label(data_info[i].basename+'('+data_info[i].gwid+')', { offset: new BMap.Size(20, -10) });
                            marker.setLabel(label);
                            markers.push(marker);
                            addClickHandlerGetWay(data_info[i].gwid, marker);
                            addMouseHandlerGetWay(data_info[i].gwid, marker);
                            map.centerAndZoom(ptt, 18);
                        }
                        else {
                            marker = new BMap.Marker(ptt, { icon: icon2 });
                            map.addOverlay(marker);
                            label = new BMap.Label(data_info[i].gwid + ":" + data_info[i].lampid, { offset: new BMap.Size(20, -10) });
                            marker.setLabel(label);
                            markers.push(marker);
                            addClickHandler(data_info[i].gwid, data_info[i].lampid, marker);
                        }
                    }
                    for (var i = 0; i < data_info.length; i++) {
                        if (data_info[i].gltype != "gateway") {
                            var points = [];
                            var polyline = new BMap.Polyline([], { strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5 });
                            var lampm = new BMap.Point(data_info[i].lng, data_info[i].lat);
                            points.push(lampm);
                            var gatem="";
                            for (var j = 0; j < data_info.length; j++) {
                                if (data_info[j].gltype == "gateway" && data_info[i].gwid == data_info[j].gwid)
                                {
                                    gatem = new BMap.Point(data_info[j].lng, data_info[j].lat);
                                    points.push(gatem);
                                    polyline.setPath(points);
                                    map.addOverlay(polyline);
                                    break;
                                }
                            }
                            
                        }                        
                    }
                    if (markers.length > 0)
                        markerClusterer = new BMapLib.MarkerClusterer(map, { markers: markers });//对地图扩大缩小后会都所有的点全显示出来。


                }
            });
        }
        function addClickHandler(gwid,lampid, marker) {
            marker.addEventListener("click", function (e) {
                openInfo(gwid,lampid, e);
            }
            );
        }
        function addClickHandlerGetWay(gwid, marker) {
            marker.addEventListener("click", function (e) {
                openInfoGerWay(gwid, e);
            }
            );
        }
        function addMouseHandlerGetWay(gwid, marker) {
            marker.addEventListener("mouseover", function (e) {
                showpic(gwid, e);
            }
            );
            marker.addEventListener("mouseout", function (e) {
                hidepic(gwid, e);
            }
            );
        }
        function showpic(gwid, e)
        {
            $("#mypic").show();
            //$("#mypic").css('left' ,e.offsetX + 'px');  // 指定创建的DIV在文档中距离左侧的位置
            //$("#mypic").css('top', e.offsetY + 'px');  // 指定创建的DIV在文档中距离顶部的位置
            
        }
        function hidepic(gwid, e)
        {
            $("#mypic").hide();

        }
        function openInfoGerWay(gwid,e) {
            top.addTab(gwid, '../../api/contrl.aspx?gprs_id=' + gwid, 'icon icon-magic');
        }

        function openInfo(gwid, lampid, e) {
            top.addTab(lampid,'/lampinfo/show.aspx?gwid=' + gwid + '&lampid='+lampid, 'icon icon-magic');
        }
        function getQueryParams(queryParams) {
            if (sebm != "")
                queryParams.sebm = sebm;
            return queryParams;

        }
        //增加查询参数，重新加载表格  
        function reloadgrid() {

            //查询参数直接添加在queryParams中      
            var queryParams = $('#tt').datagrid('options').queryParams;
            getQueryParams(queryParams);
            $('#tt').datagrid('options').queryParams = queryParams;
            $("#tt").datagrid('reload');

        }
        //初始化搜索框
        function InitSearch() {
            $("#ipt_search").searchbox({
                width: 150,
                //iconCls: 'icon-save',
                searcher: function (val, name) {
                    $('#tt').datagrid('options').queryParams.search_type = name;
                    $('#tt').datagrid('options').queryParams.search_value = val;
                    $('#tt').datagrid('reload');
                },
                prompt: '请输入查询信息'
            });
        }

    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="easyui-layout" style="width: 100%; height: 100%;">
        <div region="west" id="west" split="true" title="区域检索" style="width: 180px; overflow: scroll">
            <ul id="pt"></ul>
        </div>
        <div region="center" style="background: #eee; overflow: auto">
            <div class="easyui-layout" data-options="fit:true">
                 <div region="north" split="true" style="height:50px; overflow:auto">
                     <span id="myinfo" style="line-height:20px;">灯信息</span>
                     </div>
                <div region="west" split="true" style="width:350px; overflow: auto">
                    <table id="tt">
                    </table>
                    <div id="tab_toolbar" style="padding: 4px;">
                        <table cellpadding="0" cellspacing="0" style="width: 100%">
                            <tr>                           
                                <td style="text-align: left; padding-right: 15px">
                                    <input id="ipt_search" menu="#search_menu" />
                                    <div id="search_menu" style="width: 220px">
                                        <div name="usernum">
                                            基地名称
                                        </div>
                                        <div name="username">
                                            项目名称
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div region="center" style="background: #eee; overflow: auto;">
                    <div style="width: 100%; height: 100%; overflow: hidden; margin: 0; position: relative;">
                        <div id="mymap" style="width: 100%; height: 100%; overflow: hidden; margin: 0;"></div>
                        <div id="mypic" style="z-index:1000;display:none;position:absolute;width:80px;height:150px;left:80px; top:50px;">
                            <img src="../Images/lamp.jpg" width="80" height="150" />
                        </div>
                        <div id="Maptype" style="position: absolute; right: 40px; top: 50px; z-index: 99; color: Black; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;">
                            <input id="CBstationname" onclick="ShowstationName('checkbox')" checked="checked" style="float: left; margin-left: 10px;"
                                type="checkbox" />
                            <label onclick="ShowstationName('label')" style="float: left; text-align: left; font-size: 13px; font-family: 宋体; font-weight: bold; margin-top: 3px; cursor: pointer;">
                                显示名称</label>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</asp:Content>
